<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>API测试页面</title>
    <style>
        body { font-family: Arial, sans-serif; padding: 20px; }
        .log { background: #f5f5f5; padding: 10px; margin: 10px 0; border-left: 3px solid #007cba; }
        .error { border-left-color: #dc3545; background: #f8d7da; }
        .success { border-left-color: #28a745; background: #d4edda; }
        button { padding: 10px 20px; margin: 5px; background: #007cba; color: white; border: none; border-radius: 4px; cursor: pointer; }
    </style>
</head>
<body>
    <h1>API对象测试</h1>
    <div id="output"></div>
    
    <button onclick="testAPIObjects()">测试API对象</button>
    <button onclick="clearOutput()">清空输出</button>

    <script src="js/api.js"></script>
    
    <script>
        const output = document.getElementById('output');
        
        function log(message, type = 'log') {
            console.log(message);
            const div = document.createElement('div');
            div.className = `log ${type}`;
            div.innerHTML = `<strong>${new Date().toLocaleTimeString()}:</strong> ${message}`;
            output.appendChild(div);
            output.scrollTop = output.scrollHeight;
        }
        
        function clearOutput() {
            output.innerHTML = '';
        }
        
        function testAPIObjects() {
            log('开始测试API对象...');
            
            // 测试基本对象存在性
            log(`window.API 存在: ${typeof window.API !== 'undefined'}`, window.API ? 'success' : 'error');
            log(`window.Utils 存在: ${typeof window.Utils !== 'undefined'}`, window.Utils ? 'success' : 'error');
            
            if (window.API) {
                // 测试每个子对象
                log(`API.User 存在: ${typeof window.API.User !== 'undefined'}`, window.API.User ? 'success' : 'error');
                log(`API.Course 存在: ${typeof window.API.Course !== 'undefined'}`, window.API.Course ? 'success' : 'error');
                log(`API.Category 存在: ${typeof window.API.Category !== 'undefined'}`, window.API.Category ? 'success' : 'error');
                log(`API.Stats 存在: ${typeof window.API.Stats !== 'undefined'}`, window.API.Stats ? 'success' : 'error');
                
                // 测试每个方法
                if (window.API.User) {
                    log(`API.User.getUsers 存在: ${typeof window.API.User.getUsers === 'function'}`, 
                        typeof window.API.User.getUsers === 'function' ? 'success' : 'error');
                }
                
                if (window.API.Course) {
                    log(`API.Course.getCourses 存在: ${typeof window.API.Course.getCourses === 'function'}`, 
                        typeof window.API.Course.getCourses === 'function' ? 'success' : 'error');
                }
                
                if (window.API.Category) {
                    log(`API.Category.getCategories 存在: ${typeof window.API.Category.getCategories === 'function'}`, 
                        typeof window.API.Category.getCategories === 'function' ? 'success' : 'error');
                }
                
                log('完整的API对象结构:');
                log(`<pre>${JSON.stringify(Object.keys(window.API), null, 2)}</pre>`);
                
                // 列出每个API对象的方法
                Object.keys(window.API).forEach(apiName => {
                    const apiObj = window.API[apiName];
                    if (apiObj && typeof apiObj === 'object') {
                        const methods = Object.keys(apiObj).filter(key => typeof apiObj[key] === 'function');
                        log(`${apiName} 的方法: ${methods.join(', ')}`);
                    }
                });
            }
        }
        
        // 页面加载完成时自动测试
        document.addEventListener('DOMContentLoaded', () => {
            log('页面加载完成', 'success');
            setTimeout(() => {
                testAPIObjects();
            }, 500); 
        });
    </script>
</body>
</html> 